init()
function init(){
    getBaicaijiaTitle();
    $(".navul").on("click",clickHandler)
    reader(0)
}

function reader(titleid){
    $.ajax({
        url:"http://chst.vip:1234/api/getbaicaijiaproduct",
        data:{
            titleid
        }
    }).then(res=>{
        let html=res.result.reduce((value,item)=>{
            return value+
                `
                <li class="li${item.titleId}">
                <div class="img">
                ${item.productImg}
                </div>
                <div class="right">
                <h4>${item.productName} </h4>
                <p>${item.productPrice}</p>
                <div id="bar"><p class="matep">0%</p> </div><b>已领126张/剩余0</b>
                <strong>${item.productCoupon}</strong>
                </div>
              <div class="productHref">下单链接</div>
                </li>
                `
            },"")
            $(".baicaijia").html(html)
            animateBar()  
    })

    }
function clickHandler(e){
   var titleid=$(e.target).attr("value")*1
   reader(titleid)
}


function getBaicaijiaTitle(){
$.ajax({
    url:"http://chst.vip:1234/api/getbaicaijiatitle"
}).then(res=>{
    let html=res.result.reduce((value,item)=>{
        return value+
        `
        <li value="${item.titleId}" class="baicaili">
        ${item.title}
        </li>
        `
    },"")
    $(".navul").html(html)
})
}

function animateBar(){
    
    $(".matep").animate({
        width: "5rem",
        innerHTML:"100%"

},3500);
 
}







    





